<script setup lang="ts">
import ChannelNav from './components/ChannelNav.vue';
import ArticleList from './components/ArticleList.vue'
import { ref } from 'vue';

// 当前激活 id
const channelId = ref(0)
</script>

<template>
  <!-- 当前激活id 传给顶部, 是决定了高亮, 传给列表是决定了要显示的文章 -->
  <!-- 在事件监听中, 默认 dom 事件点击时得到的是事件对象, 但是自定义事件, 得到的则是你穿的参数 -->
  <ChannelNav :channel-id="channelId" @change-channel="channelId = $event"></ChannelNav>
  <ArticleList :channel-id="channelId"></ArticleList>
</template>
